<template>
	<view>
		<cu-custom :isBack="true" bgColor="bg-gradual-fff">
			<block slot="content">测评结果</block>
		</cu-custom>
		<u-loading-page :loading="true" loading-text="loading..." v-if="showLoading"></u-loading-page>
		<view v-show="!showLoading">
			<view class="viewbox"></view>
				<view class="request">
					<view class="text1">匹配关系</view>
					<view class="group1">
						<view class="text2">{{partnerCodeContent.mean}}</view>	
					</view>
					<view class="qa">
						<view class="g1" style="border-top: 0;" @click="handleTabClick('live', '夫妻相处')">
							<view class="te1">夫妻相处</view>
							<view class="icon1"><u-icon name="arrow-right" color="#ffffff" size="12"></u-icon></view>
						</view>
						<view class="g2" @click="handleTabClick('forbid', `${sex === '男' ? '妻子': '丈夫'}不可触碰的是什么`)">
							<view class="te1">{{`${sex === '男' ? '妻子': '丈夫'}不可触碰的是什么`}}</view>
							<view class="icon1"><u-icon name="arrow-right" color="#ffffff" size="12"></u-icon></view>
						</view>
						<view class="g3" @click="handleTabClick('lesson', `与${sex === '男' ? '妻子': '丈夫'}的相处课题`)">
							<view class="te1">{{`与${sex === '男' ? '妻子': '丈夫'}的相处课题`}}</view>
							<view class="icon1"><u-icon name="arrow-right" color="#ffffff" size="12"></u-icon></view>
						</view>
						<view class="g4" @click="handleTabClick('child', '亲子报告')">
							<view class="te1">亲子报告</view>
							<view class="icon1"><u-icon name="arrow-right" color="#ffffff" size="12"></u-icon></view>
						</view>
					</view>
				</view>
				<view class="pay" v-if="is_pay!=1">
					<view class="money" v-if="orderInfo.order_integral>0 && orderInfo.order_amount>0">
						<span>积分</span>{{orderInfo.order_integral}}+<span>¥</span>{{orderInfo.order_amount}}
					</view>
					<view class="money" v-if="orderInfo.order_integral>0 && orderInfo.order_amount<=0">
						<span>积分</span>{{orderInfo.order_integral}}
					</view>
					<view class="money" v-if="orderInfo.order_integral<=0 && orderInfo.order_amount>0">
						<span>¥</span>{{orderInfo.order_amount}}
					</view>
					<view class="money" v-if="orderInfo.order_integral==0 && orderInfo.order_amount==0">
						<span>¥</span>{{orderInfo.order_amount}}
					</view>
					<view class="btn" @click="delAddressFun">查看解读报告</view>
				</view>
		</view>	
		<u-modal
			:show="ts_show" 
			@confirm="delAddressFun" 
			@cancel="ts_show=false"
			confirmColor="#ffffff" 
			cancelColor="#ffffff" 
			:title="title" 
			:content="content"
			confirmText="付费解读"
			ref="uModal" 
			:showCancelButton="true" 
			:asyncClose="true">
		</u-modal>
	</view>
</template>
<script>
import request from '@/common/request.js';
import {
		getPartnerCodeContent
	} from '@/utils/partnerCode'
export default {
	data() {
		return {
			showLoading:true,
			ts_show:false,
			title:'查看解读报告',
			content:'查看解读报告，付费后才能查看',
			info:[],
			is_pay:0,
			orderInfo:[],
			order_sn:'',
			sex:'',
			partnerCodeContent: {
				mean: ''
			},
		}
	},
	onLoad(options) {
		const data = options.data?JSON.parse(decodeURIComponent(options.data)):'';
		this.info = data??'';
		this.order_sn=options.order_sn??'';
		this.uid=uni.getStorageSync('uid');
		if(this.info){
			this.sex = data.sex
			const selfBirthday = data.selfBirthday
			const partnerBirthday = data.partnerBirthday
			if (!selfBirthday || !partnerBirthday) {
				return
			}
			this.partnerCodeContent = getPartnerCodeContent(selfBirthday, partnerBirthday)
			this.initPageData()
		}
		if(this.order_sn){
			this.getOrderDetailFun()
		}
	},
	onShow(){
		this.uid=uni.getStorageSync('uid');
	},
	mounted() {
		
	},
	methods: {
		getOrderDetailFun(){
			let paramsList = {
				uid:this.uid,
				order_sn:this.order_sn
			}
			let optsList = {
				url: 'o-testdetail',
				method: 'post'
			};
			let _this=this;
			request.httpTokenRequest(optsList, paramsList).then(res => {
				if(res.data.code == 200){
					_this.orderDetail=res.data.data;
					_this.info=_this.orderDetail.info;
					if(_this.orderDetail.order_status==1){
						_this.sex = _this.info.sex
						const selfBirthday = _this.info.selfBirthday
						const partnerBirthday = _this.info.partnerBirthday
						if (!selfBirthday || !partnerBirthday) {
							return
						}
						_this.partnerCodeContent = getPartnerCodeContent(selfBirthday, partnerBirthday)
						_this.is_pay=1;
					}else{
						_this.sex = _this.info.sex
						const selfBirthday = _this.info.selfBirthday
						const partnerBirthday = _this.info.partnerBirthday
						if (!selfBirthday || !partnerBirthday) {
							return
						}
						_this.partnerCodeContent = getPartnerCodeContent(selfBirthday, partnerBirthday)
						_this.initPageData()
					}
				}else{
					setTimeout(() => uni.navigateBack(), 1500);
					return;
				}
				this.showLoading=false;
			});
		},
		delAddressFun() {
			this.ts_show =false;
			uni.redirectTo({
				url: '/pages/confirm_order/confirm_test_order?data=' + encodeURIComponent((JSON.stringify(
					this.info)))
			})
		},
		handleTabClick(type, title) {
			if(this.is_pay==0){
				this.ts_show =true;
				return;
			}
			const params = {
				...this.info,
				type,
				title
			}
			let pageUrl = '/pages/test_center/relation-after-pay'
			uni.navigateTo({
				url: `${pageUrl}?data=${JSON.stringify(params)}`,
			})
		},
		// 初始化页面数据
		async initPageData() {
			// 订单提交数据
			const paramsList = {
				action:'info',
				info: this.info,
				coupon_id:0,
				uid: this.uid,
			}
			let url='o-test_buy';
			let optsList = {
				url:url,
				method: 'post'
			};
			let _this=this;
			uni.showLoading({
				title: '加载中...',
				mask: true
			})
			request.httpTokenRequest(optsList, paramsList).then(res => {
				uni.hideLoading();
				if(res.data.code == 200){
					this.orderInfo = res.data.data
				}
				_this.showLoading=false;
			});
		},
		goPage(url) {
			if (!this.$util.isLogin()) {
				return;
			}
			uni.navigateTo({
				url
			});
		}
	}
}	
</script>

<style  lang="scss" scoped>
	
	.request{
		margin: auto;
		margin-top: 60rpx;
		width: 700rpx;
		height:auto;
		border-radius: 20rpx;
		box-shadow: inset 0 0 20rpx 20rpx rgba(85, 56, 105, 0.8);
		padding:40rpx;
	}
	.text1{
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FFFFFF;
		text-align: center;
	}
	.text2{
		margin-top: 22rpx;
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #CFAAFD;
		text-align: center;
	}	
	.qa{
		overflow: hidden;
		margin: auto;
		width: 100%;
		margin-top: 20rpx;
	}
	.g1,.g2,.g3,.g4{
		overflow: hidden;
		height: 120rpx;
		border-top: 1rpx solid #351740;
	}
	.te1{
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FFFFFF;
		line-height: 120rpx;
		float: left;
	}
	.icon1{
		padding-top: 50rpx;
		float:right;
	}
	.pay{
		width: 750rpx;
		height: 120rpx;
		background: #FFFFFF;
		border-radius: 10rpx 10rpx 0rpx 0rpx;
		border: 1px solid #F2F2F2;
		position: fixed;
		bottom: 0rpx;
		padding: 0 30rpx;
	}
	.money{
		line-height: 120rpx;
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FF6000;
		float: left;
	}
	.money span{
		font-size: 24rpx;
	}
	.btn{
		float: right;
		width: 330rpx;
		height: 88rpx;
		background: #62469B;
		border-radius: 44rpx;
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FFFFFF;
		line-height: 88rpx;
		text-align: center;
		margin-top: 15rpx;
	}
</style>
